<template>
  <div class="man">
    <div class="header">
    </div>
    <div class="header-a"></div>
    <div class="mancenter">
      <div class="box">
        <div class="box-top">
          <div v-if="users.isLogin">
            <div class="box-top-heade" @click="gologin()">登录成功</div>
            <div class="name">{{lists.userName}}</div>
          </div>
          <div class="box-top-heade" @click="gologin()" v-else>点击登录</div>
        </div>
        <div class="box-bottom">
          <router-link
            class="center-body"
            v-for="(item,index) in images"
            :key="item.index"
            :to="{name:'Allorder',
          query:{
            id:index
          }}"
          >
            <span class="icon">
              <img :src="item.images">
            </span>
            <span class="titile">{{item.title}}</span>
          </router-link>
        </div>
      </div>
    </div>
    <div class="manbottom">
      <div class="choose">
        <router-link to="./address" tag="div">
          <div class="chooseaddress">
            选择地址
            <img :src="images5" class="images5">
          </div>
        </router-link>

        <router-link to="./personal" tag="div">
          <div class="presonal">
            个人信息
            <img :src="images5" class="images5">
          </div>
        </router-link>
        <router-link to='./shoplogin' tag="div">
                <div class="accountsettings">
         切换商户模式
          <img :src="images5" class="images5">
        </div>
        </router-link>
      </div>
    </div>
  </div>
</template>
<script>
import { mapState, mapMutations } from "vuex";
import pic5 from "../../icons/right.png";
import routes from "@/router/routes";
import img from "../../icons/man/daipingjiaicon.png";
import * as api from "../../request/api.js"
export default {
  name: "Man",
  data() {
    return {
      images5: pic5,
      img: img,
      list: routes.filter(item => item.isNavs === true),
      lists:"",
      images: [
        {
          images: require("../../icons/man/daipingjiaicon.png"),
          title: "待付款"
        },
        {
          images: require("../../icons/man/daishouhuoicon.png"),
          title: "已付款"
        },
        {
          images: require("../../icons/man/daipingjiaicon.png"),
          title: "已取消"
        },
        { images: require("../../icons/man/lishiicon.png"), title: "全部订单" }
      ],
      data:''
    };
  },
  created(){
   this.data=this.$route.query
        this.$http
    ({
      method:"post",
      url:api.USERINFO,
      data:{},
      // headers:{
      // token:JSON.parse(localStorage.getItem('token'))
      // }
    })
    .then(resp=>{
     console.log(resp)
     if(resp.data.success==true){
       this.lists=resp.data.data
       console.log(this.lists)
     }else{
       return false;
     }
    })
    .catch(resp=>{

    })
  },
  computed: {
    ...mapState(["users"])
  },
  mounted() {
    console.log(this.images);
  },
  methods: {
    ...mapMutations(["loginout"]),
    // para(){
    //  this.$router.push({
    //    name:"Allorder",
    //    query:{
    //      id:index
    //    }
    //  })
    // }
    gologin() {
      this.$router.push({ path: "./login" });
    }
  }
};
</script>
<style lang="less" scoped>
@import "../../less/man.less";
</style>